<div class="row-fluid clearfix">
    <div class="col-md-12 column">
        <ul class="breadcrumb">
            <li>
                <a href="index.html">首页</a>
            </li>
            <li class="active">
                商户限额管理
            </li>
        </ul>
    </div>
    <div class="col-md-12 column">
        <div class="col-sm-12 div-page">
            <div class="col-sm-12 div-table">
                <div id="custom-toolbar">

                </div>
                <table id="table" class="table table-hover table-condensed" data-toolbar="#custom-toolbar"
                       data-click-to-select="true"  data-single-select="true" data-height="450">
                    <thead>
                    <tr>
                        <th data-field="state" data-checkbox="true" ></th>
                        <th data-field="UserTypeText" data-halign="center" data-align="center" data-width="120">用户类别</th>
                        <th data-field="LmtAmt" data-halign="center" data-align="center" data-width="120">单笔限额</th>
                        <th data-field="LmtAmtDay" data-halign="center" data-align="center" data-width="120">日累计限额</th>
                        <th data-field="OtherLmtAmt" data-halign="center" data-align="center" data-width="120">单笔跨行限额</th>
                        <th data-field="OtherLmtAmtDay" data-halign="center" data-align="center" data-width="120">日累计跨行限额</th>
                        <th data-field="FactorageMin" data-halign="center" data-align="center" data-width="120">手续费下限</th>
                        <th data-field="FactorageMax" data-halign="center" data-align="center" data-width="120">手续费上限</th>
                        <th data-field="UpdateDate" data-halign="center" data-align="center" data-width="120">更新日期</th>
                        <th data-field="UpdateTime" data-halign="center" data-align="center" data-width="120">更新时间</th>
                    </tr>
                    </thead>
                </table>
            </div>
        </div>
        <div class="alert alert-success" id="events-result" data-es="Aquí se muestra el resultado del evento"></div>
        <!-- #遮罩层 --->
        <div class="modal fade" id="modal-TradeEdit" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        <div class="modal-title" id="myModalLabel">
                            用户交易限额
                        </div>
                    </div>
                    <form id="validForm" method="post" class="form-horizontal layer_msg">
                        <input type="hidden" data-field="actionType" id="actionType" name="actionType" />
                        <div class="modal-body">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">用户类型</label>
                                <div class="col-sm-9">
                                    <input type="hidden" class="form-control" data-field="UserTypeText" id="UserTypeText" name="UserTypeText"  />


                                    <select class="form-control" id="UserTypeSel">
                                    </select>
                                    <input type="hidden" data-field="UserType" id="UserType" name="UserType" />
                                    <input type="hidden" data-field="UsertypeId" id="UsertypeId" name="UsertypeId" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">单笔限额</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="LmtAmt" id="LmtAmt" name="LmtAmt" placeholder="单笔交易限额" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">日累计限额</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="LmtAmtDay" id="LmtAmtDay" name="LmtAmtDay" placeholder="日累计交易限额" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">单笔跨行限额</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="OtherLmtAmt" id="OtherLmtAmt" name="OtherLmtAmt" placeholder="单笔跨行交易限额" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">日累计跨行限额</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="OtherLmtAmtDay" id="OtherLmtAmtDay" name="OtherLmtAmtDay" placeholder="日累计跨行交易限额" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">手续费下限</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="FactorageMin" id="FactorageMin" name="FactorageMin" placeholder="手续费下限" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label">手续费上限</label>
                                <div class="col-sm-9">
                                    <input type="text" min="0" class="form-control" data-field="FactorageMax" id="FactorageMax" name="FactorageMax" placeholder="手续费上限" />
                                    <span class="notice"></span>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button id="modal-btn-save" type="submit" class="btn btn-primary">保存</button>

                            <button id="modal-btn-del" type="button" class="btn btn-danger" data-dismiss="modal">确认删除</button>
                            <button id="modal-btn-close" type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>


    </div>
</div>

<script>
$(function () {
    /*获取当前角色的按钮权限-Start*/
    var btnHtml ;
    var btnRole = JSON.parse($.cookie("Role_note"));

    btnHtml = '<div class="form-inline" role="form">';
    btnHtml += (btnRole["CommonDataAdd"]) ? '<button id="btn-CommonDataAdd"  type="button" role="button" class="btn btn-sm btn-primary">' +
            '<span class="glyphicon glyphicon-plus"></span> 新增</button> ' : '' ;
    btnHtml += (btnRole["CommonDataModify"]) ? '<button id="btn-CommonDataModify" type="button" role="button" class="btn btn-sm btn-Data btn-success disabled">' +
            '<span class="glyphicon glyphicon-pencil"></span> 修改</button> ' : '' ;
    btnHtml += (btnRole["CommonDataCancel"]) ? '<button id="btn-CommonDataCancel"  type="button" role="button" class="btn btn-sm btn-Data btn-danger disabled" >' +
            '<span class="glyphicon glyphicon-trash"></span> 删除</button> ' : '' ;
    /*btnHtml += '<button id="btn-CommonDataDetail"  type="button" role="button" class="btn btn-sm btn-Data btn-info disabled" >' +
            '<span class="glyphicon glyphicon-trash"></span> 详情</button> ' ;*/

    $("#custom-toolbar").append(btnHtml);
    /*获取当前角色的按钮权限-End*/


    $('#table').bootstrapTable({
        url: globalUrl + 'api/UserType?page=1&rows=5',
        responseHandler:function(resp){
            return resp.data.rows;
        },
        pagination:false,
        pageSize:5,
        search:true
    })
    .on('click-row.bs.table', function (e, row, $element) {
        if ( $element.hasClass('selected') ) {
            $element.removeClass('info');
        }
        else {
            $element.parent('tbody').find(' > tr.selected ').removeClass("info");
            $element.addClass('info');
        }
    })
    .on('check.bs.table', function (e, row, $element) {
        $(".btn-Data").removeClass("disabled");
    })
    .on('uncheck.bs.table', function (e, row, $element) {
        $(".btn-Data").addClass("disabled");
    })

    $.ajax({
        type: "get",
        dataType: "json",
        url:globalUrl+"api/Dict?Typeid=0000000011",
        success:function(resp){
            var max=resp.data[0].Dic_data;
            $("#FactorageMax").val(max).attr("max",max);
            $(".notice").text("手续费上限<=系统手续费上限"+max);
            $('#validForm')
                    .formValidation({
                        err: {
                            container: 'popover'
                        },
                        icon: {
                            valid: 'glyphicon glyphicon-ok',
                            invalid: 'glyphicon glyphicon-remove',
                            validating: 'glyphicon glyphicon-refresh'
                        }
                    })
                    .on('success.form.fv', function(e) {
                        e.preventDefault();
                        if(parseInt($("#LmtAmt").val())>parseInt($("#LmtAmtDay").val()))
                        {
                            alert("单笔限额应小于日累计限额");
                            return;
                        }
                        if(parseInt($("#OtherLmtAmt").val())>parseInt($("#OtherLmtAmtDay").val()))
                        {
                            alert("单笔跨行限额应小于日累计跨行限额");
                            return;
                        }
                        if(parseInt($("#FactorageMin").val())>=parseInt($("#FactorageMax").val()))
                        {
                            alert("手续费下限应小于手续费上限");
                            return;
                        }
                        var $form = $(e.target);
                        var bv = $form.data('formValidation');
                        if($('#validForm').find(' input[name="actionType"] ').val()=="edit")
                        {
                            $.ajax({
                                data:$form.serializeArray(),
                                type: "put",
                                url: globalUrl + "api/UserType",
                                dataType: "json",
                                success: function (resp) {
                                    if(resp.result)
                                    {
                                        dataBindToTable($('#table'),$('#validForm'));
                                        $('#modal-TradeEdit').modal('hide');
                                    }
                                    else
                                    {
                                        alert("用户名或密码错！");
                                    }
                                },
                                error:function(){
                                    alert("更新数据失败！");
                                }
                            });
                        }
                        else if ($('#validForm').find(' input[name="actionType"] ').val()=="add")
                        {
                            $.ajax({
                                data:$form.serializeArray(),
                                type: "post",
                                url: globalUrl + "api/UserType",
                                dataType: "json",
                                success: function (resp) {
                                    if(resp.result)
                                    {
                                        $("#UsertypeId").val(resp.msg);
                                        dataAddToTable($('#table'),$('#validForm'));
                                        $(".btn-Data").addClass("disabled");
                                        $('#modal-TradeEdit').modal('hide');
                                    }
                                    else
                                    {
                                        alert(resp.msg);
                                    }
                                },
                                error:function(){
                                    alert("更新数据失败！");
                                }
                            });
                        }
                    });
        }
    });



});

function rowStyle(row, index) {
    var classes = ['success', 'error'];
    if (index % 2 == 0) {
        return {
            classes: classes[0]
        };
    }
    return {
        classes: classes[1]
    };
}

//新增按钮
$('#btn-CommonDataAdd').on("click",function () {

    //$("#events-result").text('Selected values: ' + JSON.stringify($('#validForm').serializeArray()));
    FormatDictSelect(globalUrl+"api/Dict?Typeid=0000000007",$("#UserTypeSel"),"");
    dataBindToModal($('#validForm'),null);
    $("#UserTypeSel").prop("disabled",false);
    $('#modal-btn-save').removeClass('hidden');
    $('#modal-btn-del').addClass('hidden');
    $('#validForm').find(' input[name="actionType"] ').val("add");
    $('#validForm').find(' input[name="actionType"] ').val()
    $('#modal-TradeEdit').modal('show');
});

//编辑按钮数据传递
$('#btn-CommonDataModify').on("click",function () {

    dataBindToModal($('#validForm'),$('#table'));

    FormatDictSelect(globalUrl+"api/Dict?Typeid=0000000007",$("#UserTypeSel"),$("#UserType").val());
    $('#validForm').find(' input[name="actionType"] ').val("edit");
    $("#UserTypeSel").prop("disabled",true);
    $('#modal-btn-save').removeClass('hidden');
    $('#modal-btn-del').addClass('hidden');
    $('#modal-TradeEdit').modal('show');
});

//编辑按钮数据传递
$('#btn-CommonDataCancel').on("click",function () {
    dataBindToModal($('#validForm'),$('#table'));
    //同步更新下拉列表selected事件
    FormatDictSelect(globalUrl+"api/Dict?Typeid=0000000007",$("#UserTypeSel"),$("#UserType").val());
    // SetSelectSelected($("#UserTypeSel"),$("#UserType").val());
    $("#UserTypeSel").prop("disabled",true);
    $('#modal-btn-save').addClass('hidden');
    $('#modal-btn-del').removeClass('hidden');

    $('#modal-TradeEdit').modal('show');
});

// 删除按钮数据传递
$('#btn-CommonDataDetail').on("click",function () {
    dataBindToModal($('#validForm'),$('#table'));
    //同步更新下拉列表selected事件
    FormatDictSelect(globalUrl+"api/Dict?Typeid=0000000007",$("#UserTypeSel"),$("#UserType").val());
    // SetSelectSelected($("#UserTypeSel"),$("#UserType").val());
    $("#UserTypeSel").prop("disabled",true);
    $('#modal-btn-save').addClass('hidden');
    $('#modal-btn-del').addClass('hidden');
    $('#modal-TradeEdit').modal('show');
});

$('#UserTypeSel').change(function(){
    $("#UserType").val($("select option:selected").val());
    $("#UserTypeText").val($("select option:selected").text());
})

//弹出层关闭时重置valid域
$('#modal-TradeEdit').on("hide.bs.modal",function () {
    $('#validForm').data('formValidation').resetForm();
});

$('#modal-btn-del').on("click",function () {
    $.ajax({
        type: "delete",
        url: globalUrl + "api/UserType?UsertypeId="+$('#UsertypeId').val(),
        success: function (resp) {
            if(resp.result)
            {
                //$("#events-result").text('Send data: ' + $('#validForm').serialize());
                dataDelFromTable($('#table'));
                $(".btn-Data").addClass("disabled");
                //关闭弹出窗口
                $('#modal-DataEdit').modal('hide');
            }
            else
            {
                alert(resp.msg);
            }
        },
        error:function(){
            alert("更新数据失败！");
        }
    });
});

//绑定生成数据字典下拉列表
function FormatDictSelect(_url,_obj,_defaultValue) {
    $.ajax({
        data:{},
        type: "get",
        url: _url,
        dataType: "json",
        success: function (resp) {
            if(resp)
            {
                FormatDictSelectOption(_obj,resp.data,_defaultValue);
            }
            else{alert("列表数据加载异常！");}
        },
        error:function(){alert("获取下拉列表数据失败！");}
    });
}

//生成数据字典下拉列表选项
function FormatDictSelectOption(selObj,dataObj,defaultValue) {
    selObj.empty();
    var option="";
    for(var i=0;i<dataObj.length;i++) {
        if(i==0)
        {
            option=$("<option>").text("--请选择--").val("");
            selObj.append(option);
        }
        if(defaultValue == dataObj[i].Dic_data){
            option  = $("<option>").text(dataObj[i].Dic_name).val(dataObj[i].Dic_data).attr("selected", "selected");
        }else{
            option = $("<option>").text(dataObj[i].Dic_name).val(dataObj[i].Dic_data);
        }
        selObj.append(option);
    }
}
</script>